<script setup lang="ts">
import { inject } from 'vue';
import SonSonCom from './SonSonCom.vue';


interface Person {
  name: string
  age: number
}

// 子组件 通过 defineProps 接收父组件传递的参数
defineProps<Person>()

// const emit = defineEmits<{
//   // 参数1：回调函数的名称
//   // 参数2：回调函数的参数类型
//   (e: 'my-eveny', age:number ): void
// }>()
const emit = defineEmits<{
  'my-eveny': [age: number]
  'getName': [name: string]
}>()

const totalCount = inject<number>('totalCount')
</script>

<template>
  <div class="son">
    <h2>我是子组件</h2>
    <p>{{ name }}</p>
    <p>{{ age }}</p>
    <p>provide提供的数据:{{ totalCount }}</p>
    <button @click="emit('my-eveny', age)">点击触发事件</button>
    <button @click="emit('getName', name)">点击获取名字</button>
    <SonSonCom />
  </div>
</template>

<style scoped>
.son {
  border: 1px solid red;
}
</style>